<template>
	<div>	
		<div style="width:100%;height:5px;background-color:#F8F8F8"></div>    
	    <div class="a">
	    	<div class="b">
	    		<div class="b_1">
	    			<div>
	    				<span class="d_1">{{toFix2(detailInfo.comPrice)}}</span>
	    				<span class="d_2">元</span>
	    			</div>
	    			<div class="d_3"><van-icon name="arrow" /></div>
	    		</div>
	    		<div class="b_2">
	    			<span>未付款</span>	
	    		</div>
	    		<div class="b_3">
	    			<span style="font-weight: bold;"><span class="b_4">{{h}}</span>时<span class="b_4">{{m}}</span>分后买家仍未付款，交易自动关闭</span>	
	    		</div>	    		
	    	</div>
	    	<div class="c">
	    		<div>
	    			<span style="font-size: 14px;font-weight: bold;">{{formatStr(detailInfo.userName)}}</span>
	    			<span style="margin-left: 20px;font-size: 14px;font-weight: bold;">{{formatTel(detailInfo.phonenumber)}}</span>

	    		</div>
	    		<div class="c_2">
	    			<span>{{detailInfo.address}}</span>
	    		</div>
	    	</div>
	    </div>	
		<div style="width:100%;height:5px;background-color:#F8F8F8"></div>
	</div>	
</template>

<script>
import {getFun} from '@/api/publicFun.js'	 
let publicFun=getFun()	
export default {	
	data() {
       return {
           
       }
	},
	props:['detailInfo','h','m'],
	methods: {	
       formatStr(str){
       	  if(str){
	       	  let len=str.length-1
	       	  let str1=str.substring(0,1)
	       	  for(var i=0;i<len;i++){
	       	  	str1=str1+'*'
	       	  }
	       	  return str1       	  	
       	  }else{
       	  	  return ''  
       	  }

       },
       formatTel(str){  
       	  if(str){
	       	  let str1=str.substring(0,5)
	       	  let str2=str.substring(7,11)
	       	  return str1+'****'+str2       	  	
       	  }else{
       	  	  return ''
       	  }
       }
       
	},
	mixins:[publicFun],//混入		
	mounted() {
	}
}	
</script>

<style scoped="" lang="scss">
.b{display: flex;justify-content: center;padding: 20px 0;
align-items: center;flex-direction: column;}
.b_1{display: flex;}
.b_4{color: $common-font2;}
.a{padding: 10px 10px 10px;}
.c_1{color: #aaa;}
.c_2{margin-top: 10px;}
.d_1{font-size: 36px;color: #b1b1b1;}
.d_2{color: #b1b1b1;}
.d_3{margin-left: 10px;color: #999;font-size: 14px;display: flex;align-items: center;}
.b_2{color: #b1b1b1;font-size: 16px;margin-left: -10px;margin-bottom: 10px;}
</style>